<template>
  <div id="fatd">
    <!-- tit-s -->
    <div class="tit">
      <h2>方案特点</h2>
      <div class="empty-box"></div>
      <p>一诺万金、最值得信赖的智慧安防社区解决方案服务商</p>
    </div>
    <!-- tit-e -->
    <!-- con-s -->
    <div class="con">
      <div class="con-box">
        <div
          class="box-item"
          v-for="item in message"
          :key="item.num"
        >
          <div class="item-tit">
            <h2>{{ item.num }}</h2>
          </div>
          <div class="item-con">
            <h2>{{ item.mainTit }}</h2>
            <p>{{ item.content }}</p>
          </div>
        </div>
      </div>
    </div>
    <!-- con-e -->
  </div>
</template>

<script>
  export default {
    name: "Fatd",
    data() {
      return {
        message: [
          {
            num: 1,
            mainTit: "建立全面的基础信息管理体系",
            content: "采集小区人员、车辆、房屋、出行的基础信息，登记访客人员和外来车辆，对可疑人员进行人证合一查验，全面掌握人员、车辆进出小区的轨迹路径、对社区进行全面的基础信息管控。"
          },
          {
            num: 2,
            mainTit: "建立严密的安防布控体系",
            content: "通过系统的人脸抓拍、门禁管理、车辆出入管理等系统的聚合，建立起“人防部署到位，物防设施完善，技术手段先进、应急处置高效”的集管理、防范、控制与一体的社区安防体系。"
          },
          {
            num: 3,
            mainTit: "建立高效的情报研判体系",
            content: "以社区“人、车、房、行”等海量数据为基础，以实战为应用目标，大量采集整合和利用大数据信息，直接推动警务工作的信息化，精确化和资源集约化，为平安城市建设提供数据支撑。"
          },
          {
            num: 4,
            mainTit: "建立迅速的警报响应机制",
            content: "基于动态感知的鲜活数据，以大数据分析技术为手段，构建社区分析模型算法，对社区异常行为进行主动预警，实现各类风险隐患的主动预防，从而实现由被动管理向主动管理的转变。"
          },
        ]
      }
    }
  }
</script>

<style lang="scss" scoped>

  @import "assets/scss/public";

  #fatd {
    width: 62.5%;
    margin: 4rem auto;
    .tit {
      .empty-box {
        background: linear-gradient(90deg, #2f6bee, #009fff);
      }
    };
    .con {
      padding: 4rem 8rem;
      box-shadow: 0 0 1rem #f5f5f5;
      .con-box {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        .box-item {
          width: 47.6rem;
          height: 38.2rem;
          text-align: center;
          background-image: url("https://www.1nuoyun.com/res/ynwj/img/pro/gazd/fatd-bk.png");
          background-repeat: no-repeat;
          .item-tit {
            h2 {
              font-size: 2.4rem;
              font-weight: 1000;
              color: #fff;
              margin-top: 6rem;
            }
          };
          .item-con {
            h2 {
              font-size: 2.4rem;
              font-weight: 1000;
              color: #333;
              margin: 4rem 0 1.6rem 0;
            };
            p {
              font-size: 1.6rem;
              color: #666;
              text-align: justify;
              padding: 0 6.4rem;
            }
          }
        }
      }
    };
    .con:hover {
      transition-duration: 0.3s;
      transform: translateY(-0.5rem);
    }
  }

</style>